<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ page import="com.zz.bsea.service.ProductService" %>
<%@ page import="com.zz.bsea.entity.Product" %>
<%@ page import="java.util.List" %>
<!DOCTYPE html>
<html>
<head>
  <title>产品管理</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/4.3.1/css/bootstrap.min.css">
  <script src="https://cdn.staticfile.org/jquery/3.2.1/jquery.min.js"></script>
  <script src="https://cdn.staticfile.org/popper.js/1.15.0/umd/popper.min.js"></script>
  <script src="https://cdn.staticfile.org/twitter-bootstrap/4.3.1/js/bootstrap.min.js"></script>
</head>
<body>
<%
String uname=(String)session.getAttribute("loginname");
if(uname==null){
	response.sendRedirect("/java11/BseaLogin.jsp");
}

ProductService us=new ProductService();
List<Product> ls=us.showAll();

%>

<div class="container">

 <ul class="nav">
    <li class="nav-item">
      <a class="nav-link" href="userList2.jsp">用户管理</a>
    </li>
    <li class="nav-item">
      <a class="nav-link" href="productList.jsp">产品管理</a>
    </li>
    <li class="nav-item">
      <a class="nav-link" href="#">Link</a>
    </li>
    <li class="nav-item">
      <a class="nav-link disabled" href="#">Disabled</a>
    </li>
  </ul>
  <h2>产品管理</h2>
     <!-- 按钮：用于打开模态框 -->
<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#myModal">
 添加产品
</button>      
  <table class="table table-striped table-bordered">
    <thead>
      <tr>
        <th>产品序号</th>
		<th>产品类型</th>
		<th>产品名称</th>
		<th>产品价格</th>
		<th>操作</th>
      </tr>
    </thead>
    <tbody>
     <%
for(Product product:ls){
	

%>
    <tr>
        <td><%=product.getId() %></td>
        
        <td id="tdcate<%=product.getId() %>"><%=product.getCategory() %></td>
        <td id="tdname<%=product.getId() %>"><%=product.getName() %></td>
        <td id="tdprice<%=product.getId() %>"><%=product.getPrice() %></td>
      <td>
      	<button type="button" class="btn btn-info"  onClick="openUpdate(<%=product.getId() %>)">
 		修改
		</button> 
      
      </td>
    </tr>
   <%
}
   %>
     
    </tbody>
  </table>
</div>



<!-- 模态框 -->
<div class="modal fade" id="myModal">
  <div class="modal-dialog">
    <div class="modal-content">
 
      <!-- 模态框头部 -->
      <div class="modal-header">
        <h4 class="modal-title">模态框头部</h4>
        <button type="button" class="close" data-dismiss="modal">&times;</button>
      </div>
 
      <!-- 模态框主体 -->
      <div class="modal-body">
       
       <form action="ProductServlet">
  <div class="form-group">
    <label >产品类型:</label>
    <input type="text" class="form-control" name="pcate">
  </div>
  <div class="form-group">
    <label for="pwd">产品名称:</label>
    <input type="text" class="form-control" name="pname">
  </div>
  <div class="form-group">
    <label for="pwd">产品价格:</label>
    <input type="text" class="form-control" name="pprice">
  </div>
 <input type="hidden" class="form-control" name="pcreateby" value=" <%=uname %>">
  <button type="submit" class="btn btn-primary">提交</button>
</form>
       
      </div>
 
      <!-- 模态框底部 -->
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">关闭</button>
      </div>
 
    </div>
  </div>
</div>




<!-- 模态框 -->
<div class="modal fade" id="updateModal">
  <div class="modal-dialog">
    <div class="modal-content">
 
      <!-- 模态框头部 -->
      <div class="modal-header">
        <h4 class="modal-title">修改产品</h4>
        <button type="button" class="close" data-dismiss="modal">&times;</button>
      </div>
 
      <!-- 模态框主体 -->
      <div class="modal-body">
       
       <form action="ProductServlet">
  <div class="form-group">
    <label >产品类型:</label>
    <input type="text" class="form-control" name="updatepcate">
  </div>
  <div class="form-group">
    <label for="pwd">产品名称:</label>
    <input type="text" class="form-control" name="updatepname">
  </div>
  <div class="form-group">
    <label for="pwd">产品价格:</label>
    <input type="text" class="form-control" name="updatepprice">
  </div>
 <input type="hidden" class="form-control" name="updatepcreateby" value=" <%=uname %>">
  <button type="submit" class="btn btn-primary">提交</button>
</form>
       
      </div>
 
      <!-- 模态框底部 -->
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">关闭</button>
      </div>
 
    </div>
  </div>
</div>

<script type="text/javascript">

	
	
function openUpdate(id){
	var cate=$("#tdcate"+id).text();
	$("input[name='updatepcate']").val(cate);
	var pname=$("#tdname"+id).text();
	$("input[name='updatepname']").val(pname);
	var pprice=$("#tdprice"+id).text();
	$("input[name='updatepprice']").val(pprice);
	$('#updateModal').modal('show')
}
	
	


</script>
</body>
</html>